<template>
	<view class="content">
		<view class="text-area">
			<view style="margin-top: 100upx;margin-bottom: 100upx;">
				<text class="title">健康助手</text>
			</view>
			<view class="tipText">
				<text>{{username}}您好</text>
			</view>
			<!-- <view class="welcome">{{username}}您好</view> -->
		</view>

		<view class="buttonGroup">
			<navigator url="../user/user_setting" class="linkBtn">个人设置</navigator>
		</view>

		<label v-if="myGroupList.length" style="font-size: 20px;">我管理的团体</label>

		<!-- <label>此处显示团体列表</label> -->
		<view class="groupList"
			v-for="(myGroupListVal, myGroupListIdx) in myGroupList"
			:key="myGroupListIdx">
			<navigator :url="'../group/group_detail?group_id='+myGroupListVal._id">{{myGroupListVal.name}}</navigator>
			<!-- <view>{{myGroupListVal.name}}</view> -->
			<button class="mini" @click="deleteGroup(myGroupListVal._id,myGroupListIdx)">删除</button>
		</view>

		<view class="buttonGroup">
			<navigator url="../group/create_group" class="linkBtn">创建团体</navigator>
		</view>

		<view class="buttonGroup">
			<navigator url="../template/my_template" class="linkBtn">我的模板</navigator>
		</view>

		<view class="buttonGroup">
			<navigator url="../index/about" class="linkBtn">关于</navigator>
		</view>

		<button type="default" class="logOutBtn" @click="logout">退出登录</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				username: "",
				glayer: 0, // 下属层次
				userType: 4,

				account_id: '',
				myGroupList: []
			};
		},
		onShow() {
			this.getUserInfo();

			this.account_id = uni.getStorageSync("uid");
			if (!this.account_id) {
				// uni.navigateTo({
				// 	url: "/pages/user/user_login"
				// });
			} else {
				this.getMyGroupList();
			}
		},
		methods: {
			getMyGroupList() {
				uniCloud.callFunction({
					name: "ha_get_group",
					data: {
						account_id: this.account_id
					},
					success: ({result}) => {
						// console.log(result)
						this.myGroupList = result.data;
					},
					fail() {
						uni.showToast({
							icon: 'none',
							title: '网络异常，请稍后重试！'
						});
					}
				});
			},
			logout() {
				//用户退出，清楚缓存信息
				uni.removeStorageSync("token");
				uni.removeStorageSync("uid");
				uni.removeStorageSync("userType");
				uni.removeStorageSync("class_id");
				uni.removeStorageSync("stu_no");
				uni.removeStorageSync("stu_name");

				uni.navigateTo({
					url: "/pages/user/user_login"
				});
			},
			getUserInfo() {
				console.log("getUserInfo begin");
				uni.showLoading({
					title: "加载中..."
				});

				let token = uni.getStorageSync("token");

				if (token) {
					uniCloud
						.callFunction({
							name: "validateToken",
							data: {
								token: uni.getStorageSync("token")
							}
						})
						.then(res => {
							console.log("validateToken", res.result.data);
							try {
								const {
									username,
									userType
								} = res.result.data;
								this.username = username;
								this.userType = userType;
							} catch (e) {
								throw new Error("参数错误请重新登录!");
							}
							uni.hideLoading();
						})
						.catch(err => {
							uni.hideLoading();
							uni.showModal({
								content: "请求云函数发生错误!\n" + err.message,
								showCancel: false
							});
							uni.navigateTo({
								url: '/pages/user/user_login'
							});
						});
				} else {
					//    发布时打开
					uni.navigateTo({
						url: "../user/user_login"
					});
				}
			},
			deleteGroup(group_id,index) {
				uni.showModal({ content: '确认删除吗？', success: (res) => { if (res.confirm) {
					console.log(group_id);

					uniCloud.callFunction({
						name: "ha_del_group",
						data: {
							group_id
						},
						success: ({result}) => {
							console.log(result);
							
							if ( result.status === 0 ) {
								uni.showToast({
									title: `${result.msg || "删除成功！"}`,
									duration: 1000
								});
								// location.reload();
								this.myGroupList.splice(index, 1);
							} else {
								uni.showToast({
									icon: 'none',
									title: `${result.msg || "网络异常，请稍后重试！"}`,
									duration: 1000
								});
							}
						},
						fail() {
							uni.showToast({
								icon: 'none',
								title: '网络异常，请稍后重试！'
							});
						}
					});
				}}});
			}
		}
	};
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 100rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		text-align: center;
	}

	.tipText {
		text-align: left;
		margin: 40upx 0;
	}

	.title {
		font-size: 20px;
		text-align: center;
		font-weight: bold;
		margin-bottom: 30upx;
		padding: 20px 0px;
	}

	.buttonGroup {
		width: 100%;
		margin-bottom: 40upx;
	}

	.buttonGroup .linkBtn {
		font-size: 30upx;
		display: block;
		line-height: 80upx;
		margin: 0 auto;
		width: 90%;
		text-align: center;
		margin-bottom: 20upx;
		border-radius: 40upx;
		box-shadow: 0 3px 5px rgba(5, 26, 180, 0.35);
		font-weight: bold;
		background: linear-gradient(135deg, #576fec 0%, #576fec 76%, #536dec 76%);
		color: #fff;
	}

	.logOutBtn {
		flex: 1;
		width: 90%;
		margin-top: 20upx;
	}

	.welcome {
		padding-left: 22px;
		margin-bottom: 35px;
	}
	
	.groupList {
		justify-content: space-between;
		width: 90%;
		display: flex;
		margin: 10rpx 0;
	}
	.groupList navigator,view {
		margin-left: 20rpx;
	}
	.groupList button {
		margin-right: 20rpx;
	}
</style>
